<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                template="/WEB-INF/templates/newMainTemplateWithFooter.xhtml">
    <ui:define name="metaTitle">
        <title>#{workWithUsMessages.MetaTitle1} #{createCandidateForCompanyBean.company.name} #{workWithUsMessages.MetaTitle2}</title>
    </ui:define>
    <ui:define name="metaDescription">
        <meta name="Description" content="#{workWithUsMessages.MetaDescription1} #{createCandidateForCompanyBean.company.name}#{workWithUsMessages.MetaDescription1}"></meta>
    </ui:define>
    <ui:define name="metaKeywords">
        <meta name="Keywords" content="#{createCandidateForCompanyBean.company.name},#{workWithUsMessages.Keyword1} #{createCandidateForCompanyBean.company.name},#{workWithUsMessages.Keyword2} #{createCandidateForCompanyBean.company.name},#{workWithUsMessages.Keyword3} #{createCandidateForCompanyBean.company.name},#{workWithUsMessages.Keyword4} #{createCandidateForCompanyBean.company.name},#{workWithUsMessages.Keyword5},#{workWithUsMessages.Keyword6},#{workWithUsMessages.Keyword7},#{workWithUsMessages.Keyword8},#{workWithUsMessages.Keyword9}"></meta>
    </ui:define>
    <ui:define name="canonical">
        <link rel="canonical" href="http://www.therecruitery.com"></link>
    </ui:define>
    
    <ui:define name="bar">
        <h:outputStylesheet library="css" name="bar/bar.css"></h:outputStylesheet>
        <h:outputStylesheet library="css" name="bar/bar_desktop.css" media="screen and (min-width:1025px) and (max-width:1600px)"></h:outputStylesheet>
        <h:outputStylesheet library="css" name="bar/bar_desktop_wide.css" media="screen and (min-width : 1601px)"></h:outputStylesheet>
        <h:outputStylesheet library="css" name="bar/bar_tablet.css" media="screen and (min-device-width : 768px) and (max-device-width : 1024px), screen and (max-width:1024px)"></h:outputStylesheet>
        <h:outputStylesheet library="css" name="bar/bar_smartphone.css" media="screen and (min-device-width : 320px) and (max-device-width : 767px), screen and (max-width:767px)"></h:outputStylesheet>
        
        <div id="bar" class="homeBar fixed">
        <p:commandLink process="@this" styleClass=" logo" action="#{loginBean.goIndex()}">
            <h:graphicImage library="images" style="width:100%" alt="#{indexMessages.LogoAlt}" name="logo.png"></h:graphicImage>
        </p:commandLink>
        <span class="ui-button-text menuButton floatRight displayNone smartphone bodyFont inlineBlock">#{indexMessages.Menu}</span>
        <div id="navBar" class="overflowHidden height0 textAlignRight">
        <ul class="barMenu">
            <li class="barMenuItem bodyFont textAlignRight">
                <p:commandLink process="@this" update=":suggestionsForm:suggestionsDialog" styleClass="noSmartphone ui-button-text" oncomplete="PF('suggestionsDialog').show();" value="#{messages.Contact}"></p:commandLink>
                <p:commandLink process="@this" styleClass="ui-button-text displayNone smartphone" action="/views/smartphone/Suggestions?faces-redirect=true" value="#{messages.Contact}"></p:commandLink>
            </li>
            <li class="barMenuItem bodyFont textAlignRight">
                <p:commandLink process="@this" styleClass="noSmartphone ui-button-text" onclick="PF('loginDialog').show();" value="#{indexMessages.Login}"></p:commandLink>
                <p:commandLink process="@this" styleClass="ui-button-text displayNone smartphone" action="/views/smartphone/Login?faces-redirect=true" value="#{indexMessages.Login}"></p:commandLink>
            </li>
            <li class="barMenuItem textAlignRight">
                <p:commandLink process="@this" styleClass="noSmartphone ui-button-text" onclick="PF('registerDialog').show();" value="#{indexMessages.Register}"></p:commandLink>
                <p:commandLink process="@this" styleClass="ui-button-text displayNone smartphone" action="/views/smartphone/RegisterWorkWithUs?faces-redirect=true" value="#{indexMessages.Register}"></p:commandLink>
            </li>
             <li class="barMenuItem bodyFont textAlignRight">
                <p:commandLink process="@this" styleClass="ui-button-text" action="/company?faces-redirect=true" value="#{indexMessages.Companies}"></p:commandLink>
            </li>
        </ul>
       </div>
    </div>
    </ui:define>
    
    
    <ui:define name="newContent">
        <h:outputStylesheet library="css" name="index/index.css"></h:outputStylesheet>
        <h:outputStylesheet library="css" name="index/index_desktop.css" media="screen and (min-width:1025px) and (max-width:1600px)"></h:outputStylesheet>
        <h:outputStylesheet library="css" name="index/index_desktop_wide.css" media="screen and (min-width : 1601px)"></h:outputStylesheet>
        <h:outputStylesheet library="css" name="index/index_tablet.css" media="screen and (min-device-width : 768px) and (max-device-width : 1024px), screen and (max-width:1024px)"></h:outputStylesheet>
        <h:outputStylesheet library="css" name="index/index_smartphone.css" media="screen and (min-device-width : 320px) and (max-device-width : 767px), screen and (max-width:767px)"></h:outputStylesheet>
        
        <h:form id="loginForm">
            <p:remoteCommand name="redirect" action="#{loginBean.redirectIndex()}" process="@this" autoRun="true"></p:remoteCommand>
            <p:growl  id="growl" showDetail="false" autoUpdate="true" life="3000" />
            <p:dialog draggable="false" resizable="false" header="#{indexMessages.Login}" position="top" modal="true" widgetVar="loginDialog" id="loginDialog">
                <p:inputText styleClass="loginEmail" id="loginEmail" value="#{loginBean.email}" required="true" requiredMessage="#{messages.EmailRequired}" label="#{messages.Email}">  
                    <f:validator  binding="#{loginEmailValidator}"></f:validator>
                    <p:ajax event="change" update="growl" />
                </p:inputText> 
                <p:watermark for="loginEmail" value="#{messages.Email}" /> 
                <p:password style="margin-bottom: 1em!important" styleClass="loginPassword" id="loginPassword" value="#{loginBean.password}" required="true" requiredMessage="#{messages.PasswordRequired}" label="#{messages.Password}">
                    <f:validateLength minimum="5" maximum="30"></f:validateLength>
                    <p:watermark for="loginPassword" value="#{messages.Password}" />
                </p:password>
                <p:commandButton style="margin-bottom: 1em;margin-left: 0.3em;" styleClass="landingButton loginLandingButton blueBackgroundStrong" process="@form" value="#{messages.LogIn}" update=":loginForm:growl" id="ajax" action="#{loginBean.logIn}" />
                <p:commandLink process="@this" oncomplete="PF('loginDialog').hide();PF('passwordRecoveryDialog').show();" actionListener="#{recoveryPasswordBean.reinitEmail()}" styleClass="forgot" value="#{messages.ForgotPassword}"></p:commandLink>
            </p:dialog>
            
            <div id="workWithUs" class="marginTopBar"  style="text-align: center;">
                <h:graphicImage styleClass="workWithUsLogo" value="/companyFiles/#{createCandidateForCompanyBean.company.idCompany.toString()}/images/#{createCandidateForCompanyBean.company.logo}" rendered="#{createCandidateForCompanyBean.company.logo!=null}" alt="#{workWithUsMessages.AltLogo} #{createCandidateForCompanyBean.company.name}"></h:graphicImage>
                <div class="landingTextDivWorkWithUs">
                    <h1 class="sloganWorkWithUs upperCase titleFont">#{workWithUsMessages.Title} #{createCandidateForCompanyBean.company.name}</h1>
                        <h:outputFormat styleClass="landingText contentText bodyFont paragraph textAlignJustify" value="#{workWithUsMessages.Text1}">
                            <f:param value="#{createCandidateForCompanyBean.company.name}"></f:param>
                        </h:outputFormat>
                        <h:outputFormat styleClass="noSmartphone landingText textAlignJustify contentText bodyFont paragraph" value="#{workWithUsMessages.Text2}">
                            <f:param value="#{createCandidateForCompanyBean.company.name}"></f:param>
                        </h:outputFormat>
                        <h:outputText styleClass="displayNone smartphone landingText textAlignJustify contentText bodyFont paragraph" value="#{workWithUsMessages.Text2Smartphone}"></h:outputText>
                        <h:outputText styleClass="landingText contentText textAlignJustify bodyFont block" value="#{indexMessages.TheRecruiterySlogan}"></h:outputText>
                </div>
                <div style="padding:2em;">
                    <p:commandButton styleClass='landingButton redBackgroundStrong registerLandingButton noSmartphone' process="@this" onclick="PF('registerDialog').show()" value="#{indexMessages.Register}"></p:commandButton>
                    <p:commandButton styleClass='landingButton redBackgroundStrong registerLandingButton displayNone smartphone inlineBlock' process="@this"  action="/views/smartphone/RegisterWorkWithUs?faces-redirect=true" value="#{indexMessages.Register}"></p:commandButton>
                </div>
                        
            </div>
            
            <div id="steps" class="steps sectionContainer">
                <div class="step" id="step1">
                    <div class="stepFigureDiv leftFigure">
                        <h:graphicImage alt="#{indexMessages.Step1Alt}" styleClass="stepFigure leftFigure noSmartphone" library="images" name="ilus1_alta.png"></h:graphicImage>
                        <h:graphicImage alt="#{indexMessages.Step1Alt}" styleClass="stepFigure leftFigure displayNone smartphone" library="images" name="ilus1_sinflecha_alta.png"></h:graphicImage>
                    </div>
                    <div class="stepTextDiv">
                        <h2 class="stepTextTitle noSmartphone titleText upperCase titleFont colorGrey">#{indexMessages.Step1Title}</h2>
                        <h2 class="displayNone stepTextTitle smartphone titleText upperCase titleFont colorGrey">#{indexMessages.Step1TitleSmartphone}</h2>
                        <h:outputFormat styleClass="stepTextBody noSmartphone contentText bodyFont colorWhite" value="#{workWithUsMessages.Step1Description}">
                            <f:param value="#{createCandidateForCompanyBean.company.name}"></f:param>
                        </h:outputFormat>
                        <h:outputFormat styleClass="displayNone smartphone stepTextBody contentText bodyFont colorWhite" value="#{workWithUsMessages.Step1DescriptionSmartphone}">
                            <f:param value="#{createCandidateForCompanyBean.company.name}"></f:param>
                        </h:outputFormat>
                    </div>
                    <div class="stepFigureDiv rightFigure noSmartphone">
                        <h:graphicImage alt="#{indexMessages.Step1Alt}" styleClass="stepFigure" library="images" name="flecha_derecha.png"></h:graphicImage>
                    </div>
                </div>
                <div class="step" id="step2">
                    <div class="stepFigureDiv leftFigure noSmartphone">
                        <h:graphicImage alt="#{indexMessages.Step2Alt}" styleClass="stepFigure" library="images" name="flecha_izquierda.png"></h:graphicImage>
                    </div>
                    <div class="stepTextDiv">
                        <h2 class="stepTextTitle upperCase noSmartphone titleFont titleText colorGrey">#{indexMessages.Step2Title}</h2>
                        <h2 class="displayNone stepTextTitle upperCase smartphone titleFont titleText colorGrey">#{indexMessages.Step2TitleSmartphone}</h2>
                        <h:outputFormat styleClass="stepTextBody contentText bodyFont colorWhite noSmartphone" value="#{workWithUsMessages.Step2Description}">
                            <f:param value="#{createCandidateForCompanyBean.company.name}"></f:param>
                        </h:outputFormat>
                        <h:outputFormat styleClass="displayNone smartphone stepTextBody contentText bodyFont colorWhite" value="#{workWithUsMessages.Step2DescriptionSmartphone}">
                            <f:param value="#{createCandidateForCompanyBean.company.name}"></f:param>
                        </h:outputFormat>
                    </div>
                    <div class="stepFigureDiv rightFigure">
                        <h:graphicImage alt="#{indexMessages.Step2Alt}" styleClass="stepFigure noSmartphone" library="images" name="ilus2_alta.png"></h:graphicImage>
                        <h:graphicImage alt="#{indexMessages.Step2Alt}" styleClass="stepFigure leftFigure displayNone smartphone" library="images" name="ilus2_sinflecha_alta.png"></h:graphicImage>
                    </div>
                </div>
                <div class="step" id="step3">
                    <div class="stepFigureDiv leftFigure">
                        <h:graphicImage alt="#{indexMessages.Step3Alt}" styleClass="stepFigure noSmartphone" library="images" name="ilus3_alta.png"></h:graphicImage>
                        <h:graphicImage alt="#{indexMessages.Step3Alt}" styleClass="stepFigure leftFigure displayNone smartphone" library="images" name="ilus3_sinflecha_alta.png"></h:graphicImage>
                    </div>
                    <div class="stepTextDiv">
                        <h2 class="stepTextTitle upperCase titleText titleFont colorGrey">#{indexMessages.Step3Title}</h2>
                        <h:outputFormat styleClass="stepTextBody noSmartphone contentText bodyFont colorWhite" value="#{workWithUsMessages.Step3Description1}">
                            <f:param value="#{createCandidateForCompanyBean.company.name}"></f:param>
                        </h:outputFormat>
                        <h:outputFormat styleClass="stepTextBody displayNone smartphone contentText bodyFont colorWhite" value="#{workWithUsMessages.Step3Description1Smartphone}">
                            <f:param value="#{createCandidateForCompanyBean.company.name}"></f:param>
                        </h:outputFormat>
                        <h:outputFormat styleClass="stepTextBody noSmartphone contentText bodyFont colorWhite" value="#{workWithUsMessages.Step3Description2}">
                            <f:param value="#{createCandidateForCompanyBean.company.name}"></f:param>
                        </h:outputFormat>
                    </div>
                    <div class="stepFigureDiv rightFigure noSmartphone">
                        <h:graphicImage alt="#{indexMessages.Step3Alt}" styleClass="stepFigure" library="images" name="flecha_derecha.png"></h:graphicImage>
                    </div>
                </div>
            </div>
            <div id="grid" class="grid sectionContainer">
                <div class="stepGrid">
                    <div class="gridFigureDiv leftFigure floatLeft">
                        <h:graphicImage alt="#{indexMessages.Grid1Alt}"  styleClass="stepFigure leftFigure blackwhiteGridPicture" library="images" name="dependienta-malaga.jpg"></h:graphicImage>
                    </div>
                    <div class="gridTextDiv gridTextDivLeft">
                        <h2 class="stepTextTitle upperCase titleText titleFont colorGrey">#{indexMessages.Grid1Title}</h2>
                        <h:outputText styleClass="stepTextBody contentText bodyFont" value="#{indexMessages.Grid1Description}"></h:outputText>
                        <h:outputText styleClass="stepTextFooter bodyFont" value="#{indexMessages.Grid1Footer}"></h:outputText>
                    </div> 
                </div>

                <div class="stepGrid">
                    <div class="gridTextDiv floatRight noMarginRight gridTextDivRight">
                        <h2 class="stepTextTitle upperCase titleText titleFont colorGrey">#{indexMessages.Grid2Title}</h2>
                        <h:outputText styleClass="stepTextBody contentText bodyFont" value="#{indexMessages.Grid2Description}"></h:outputText>
                        <h:outputText styleClass="stepTextFooter bodyFont" value="#{indexMessages.Grid2Footer}"></h:outputText>
                    </div>
                    <div class="gridFigureDiv leftFigure floatRight">
                        <h:graphicImage alt="#{indexMessages.Grid2Alt}" styleClass="stepFigure leftFigure blackwhiteGridPicture" library="images" name="ana-fernandez-retail-manager-scalpers.jpg"></h:graphicImage>
                    </div>
                </div>
                <div class="stepGrid noSmartphone littleStep1">
                    <div class="leftFigure block width100">
                        <h:graphicImage alt="#{indexMessages.Grid3Alt}" styleClass="stepFigure leftFigure blackwhiteGridPicture" library="images" name="importancia-imagen.jpg"></h:graphicImage>
                    </div>
                    <div class="gridTextDiv noMarginLeft">
                        <h2 class="stepTextTitle upperCase noSmartphone titleText titleFont colorGrey">#{indexMessages.Grid3Title}</h2>
                        <h:outputText styleClass="stepTextBody contentText bodyFont" value="#{indexMessages.Grid3Description}"></h:outputText>
                    </div>
                </div>
                <div class="gridTextDiv fullTextDiv ">
                    <h2 class="stepTextTitle upperCase titleText titleFont colorWhite">#{indexMessages.Grid4Title}</h2>
                    <h:outputText styleClass="stepTextBody contentText bodyFont colorWhite" value="#{indexMessages.Grid4Description}"></h:outputText>
                    <h:outputText styleClass="stepTextBody contentText bodyFont colorWhite" value="#{indexMessages.Grid4Description2}"></h:outputText>
                    <p:commandButton style="border:solid 1px;" styleClass='landingButton redBackgroundStrong registerLandingButton floatLeft noSmartphone' process="@this" onclick="PF('registerDialog').show()" value="#{indexMessages.Grid4Button}"></p:commandButton>
                    <p:commandButton style="border:solid 1px;" styleClass='landingButton redBackgroundStrong registerLandingButton floatLeft displayNone smartphone' process="@this" action="/views/smartphone/RegisterWorkWithUs?faces-redirect=true" value="#{indexMessages.Grid4Button}"></p:commandButton>
                </div>
                <div class="stepGrid littleStep2 noSmartphone noMarginRight">
                    <div class="leftFigure block width100">
                        <h:graphicImage alt="#{indexMessages.Grid4Alt}" styleClass="stepFigure leftFigure blackwhiteGridPicture" library="images" name="importancia-entrevista.jpg"></h:graphicImage>
                    </div>
                    <div class="gridTextDiv noMarginLeft">
                        <h2 class="stepTextTitle upperCase noSmartphone titleText titleFont colorGrey">#{indexMessages.Grid5Title}</h2>
                        <h:outputText styleClass="stepTextBody contentText bodyFont" value="#{indexMessages.Grid5Description}"></h:outputText>
                    </div>
                </div>
            </div>
        </h:form>
        <h:form id="registerForm">
            <p:dialog draggable="false" resizable="false" header="#{indexMessages.Register}" modal="true" widgetVar="registerDialog" position="top" id="registerDialog">
                <p:inputText styleClass="loginInput" id="email" value="#{createCandidateForCompanyBean.candidate.user.email}" required="true" requiredMessage="#{messages.EmailRequired}" label="#{messages.Email}">		
                    <f:validator  binding="#{emailValidator}"></f:validator>		
                    <p:ajax event="change" update=":loginForm:growl" />		
                </p:inputText>
                <p:watermark for="email" value="#{messages.Email}" /> 

                <p:password styleClass="loginInput" id="password" match="password2" feedback="true" value="#{createCandidateForCompanyBean.candidate.user.password}" required="true" requiredMessage="#{messages.PasswordRequired}" label="#{messages.Password}">
                    <f:validateLength minimum="5" maximum="30"></f:validateLength>
                </p:password>
                <p:watermark for="password" value="#{messages.Password}" />

                <p:password style="margin-bottom: 1em;" styleClass="loginInput" id="password2" feedback="true" value="#{createCandidateForCompanyBean.candidate.user.password}" required="true" requiredMessage="#{messages.RepeatPasswordRequired}" label="#{messages.RepeatPassword}">
                </p:password>
                <p:watermark for="password2" value="#{messages.RepeatPassword}" />
                <div class="floatRight contractDiv">
                    <h:outputText styleClass="contractMessage" value="#{messages.ContractAccept} "></h:outputText>
                    <p:commandLink styleClass="contractMessage contractLink" value="#{messages.UseTerms} " process="@this" action="/views/recruit/UseTerms?faces-redirect=true"></p:commandLink>
                    <h:outputText styleClass="contractMessage" value="#{messages.And} "></h:outputText>
                    <p:commandLink styleClass="contractMessage contractLink" value="#{messages.PrivacyPolicy}" process="@this" action="/views/recruit/Privacy?faces-redirect=true"></p:commandLink>
                </div>    
                <p:commandButton style="margin-bottom: 1em;margin-left: 0.3em;" process="@parent"  styleClass="landingButton loginLandingButton redBackgroundStrong" value="#{indexMessages.Register}" update=":loginForm:growl" action="#{createCandidateForCompanyBean.createCandidate}" />  
            </p:dialog>
        </h:form>
        <h:form id="recoveryForm">
            <p:dialog draggable="false" resizable="false" id="passwordRecoveryDialog" position="top" widgetVar="passwordRecoveryDialog" header="#{messages.ForgotPassword}" modal="true">
                <p:panelGrid styleClass="noBorder noPadding noMargin" columns="1">
                    <p:inputText id="recoveryEmail" value="#{recoveryPasswordBean.email}">
                        <f:validator  binding="#{loginEmailValidator}"></f:validator>
                        <p:ajax event="change" update=":loginForm:growl" />
                    </p:inputText>
                    <p:watermark for="recoveryEmail" value="#{messages.Email}" />
                    <p:captcha label="Captcha" theme="white"></p:captcha>
                    <p:commandButton styleClass="grayBackgroundStrong" update=":loginForm:growl" value="#{messages.Recover}" actionListener="#{recoveryPasswordBean.createRecovery()}"></p:commandButton>
                </p:panelGrid>
            </p:dialog>
        </h:form>
    <h:outputScript library="javascript" name="bar.js"></h:outputScript>
    </ui:define>

</ui:composition>
</html>